<template>
	<el-form-item :label="$t('designer.setting.macroModel')">
		<el-select v-model="thisOptionModel.macroModelValue">
			<el-option
				v-for="item in thisOptionModel.macroModel"
				:key="item.value"
				:label="item.label"
				:value="item.value">
			</el-option>
		</el-select>
	</el-form-item>
	<el-form-item :label="$t('designer.setting.macroFormat')" v-if="thisOptionModel.macroModelValue=='1'||thisOptionModel.macroModelValue=='2'||thisOptionModel.macroModelValue=='3'">
		<el-select v-model="thisOptionModel.macroFormatValue">
			<el-option
				v-for="item in (thisOptionModel.macroModelValue=='1'?thisOptionModel.macroFormat.yearFormat:(thisOptionModel.macroModelValue=='2'?thisOptionModel.macroFormat.dateFormat:thisOptionModel.macroFormat.timeFormat))"
				:key="item.value"
				:label="item.label"
				:value="item.value">
			</el-option>
		</el-select>
	</el-form-item>
</template>

<script>
import {isEmptyStr} from "@/utils/util"

export default {
	name: "macro-model-editor",
	mixins: [],
	props: {
		designer: Object,
		selectedWidget: Object,
		optionModel: Object,
	},
	inject: ['serverFieldList', 'getDesignerConfig'],
	data() {
		return {
			thisOptionModel: this.optionModel,
			thisSelectedWidget: this.selectedWidget,
			nameRequiredRule: [{required: true, message: 'name required'}],
		}
	},
	watch: {
		'optionModel': {
			handler(val) {
				if (val) {
					this.thisOptionModel = val
				}
			}
		}
	},
	computed: {
	},
	methods: {
	},
	mounted() {
	}
}
</script>

<style lang="scss" scoped>

</style>
